function showCalculateITVChart() {
    console.log('function')

    city_name = $('#city_name')[0].innerText;
    getSWListCalculateOnITVByCity(city_name);

    getOLTListCalculateOnITVByCity(city_name);
    $('#modal_topo_body')[0].innerHTML = '<div class="row" style="height: 50%;width: 100%">  ' +
        '                        <div class="col-md-12" id="sw_canvas_div" style="height: 100%;width: 100%">  ' +
        '                            <canvas id="sw_canvas" style="height:50%;width: 100%;background-color: #0F161C"></canvas>  ' +
        '                        </div>  ' +
        '                    </div>  ' +
        '                <div class="row" style="height: 50%;width: 100%">  ' +
        '                    <div class="col-md-12" id="olt_canvas_div" style="height: 100%;width: 100%">  ' +
        '                        <canvas id="olt_canvas" style="height:50%;width: 100%;background-color: #0F161C"></canvas>  ' +
        '                    </div>  ' +
        '                </div>'


    $('#sw_canvas_div').mCustomScrollbar({
        scrollButtons:{ scrollType: "stepped" },
        axis:"x"
    });

    $('#olt_canvas_div').mCustomScrollbar({
        scrollButtons:{ scrollType: "stepped" },
        axis:"x"
    });

    var labelOption = {
        normal: {
            show: true,
            rotate: 90,
            fontSize: 15,
            color:'#FFFFFF',
            position:'top',
            align: 'left',
            verticalAlign:'middle'


        }
    };
    myChartSW = echarts.init(document.getElementById('sw_canvas'));
    optionSW =  {
        color: ['#003366', '#006699'],
        title: {
            text: 'itv转高清后SW预测流量',
            textStyle: {
                color: '#FFFFFF'
            }
        },
        grid:{
            left:120,
            right:40
        },
        tooltip: {
            trigger: 'axis',
        },
        legend: {
            data: ['现流量', '预测流量']
        },
        calculable: true,
        xAxis: [
            {
                type: 'category',
                axisTick: {show: false},
                data: calculate_sw_itv_list,
                axisLabel: {
                    show: true,
                    rotate: 10,

                    textStyle: {
                        color: '#FFFFFF',
                        fontSize:15
                    }
                }
            }
        ],
        yAxis: [
            {
                type: 'value',
                axisLabel : {
                    formatter: '{value}',
                    textStyle: {
                        color: '#FFFFFF'
                    }
                }
            }
        ],
        barCategoryGap: '500%',
        barWidth : 30,
        series: [
            {
                type: 'bar',
                barGap: 0,
                label: labelOption,
                data: sw_old_itv_flow
            },
            {
                type: 'bar',
                label: labelOption,
                data: sw_new_itv_flow
            }
        ]
    };
    myChartSW.setOption(optionSW);
    sw_canvas_itv_width = sw_new_itv_flow.length*200
    $('#sw_canvas').css('height','300px')
    $('#sw_canvas').css('width',sw_canvas_itv_width+'px')
    myChartSW.resize();
    myChartOLT = echarts.init(document.getElementById('olt_canvas'));
    optionOLT =  {
        color: ['#003366', '#006699'],
        title: {
            text: 'itv转高清后OLT预测流量',
            textStyle: {
                color: '#FFFFFF'
            }
        },
        grid:{
            left:120,
            right:20
        },
        tooltip: {
            trigger: 'axis',
        },
        legend: {
            data: ['现流量', '预测流量']
        },
        calculable: true,
        xAxis: [
            {
                type: 'category',
                axisTick: {show: false},
                data: calculate_olt_itv_list,
                axisLabel: {
                    show: true,
                    rotate: 10,
                    textStyle: {
                        color: '#FFFFFF',
                        fontSize:15
                    }
                }
            }
        ],
        yAxis: [
            {
                type: 'value',
                axisLabel : {
                    formatter: '{value}',
                    textStyle: {
                        color: '#FFFFFF'
                    }
                }
            }
        ],
        barCategoryGap: '500%',
        barWidth : 30,
        series: [
            {
                type: 'bar',
                barGap: 0,
                label: labelOption,
                data: olt_old_itv_flow
            },
            {
                type: 'bar',
                label: labelOption,
                data: olt_new_itv_flow
            }
        ]
    };
    myChartOLT.setOption(optionOLT);
    olt_canvas_itv_width = olt_new_itv_flow.length*200;
    $('#olt_canvas').css('height','300px')
    $('#olt_canvas').css('width',olt_canvas_itv_width+'px')
    myChartOLT.resize();
    $('#topo_title')[0].innerText = 'itv提升至高清预测情况'

    $('#modal_topo').modal('show');

}